<script setup>
import {ref, reactive, watch, getCurrentInstance, nextTick} from 'vue'
import SelectPopup from "@/components/selectPopup.vue";
import DatePopup from "@/components/datePopup.vue";
import SelectStore from "@/components/selectStore.vue";
import {
  uploadUrl,
  getDeptByParent,
  updateUserSign
} from "@/api";
import {getDangerList, addEnterpriseCheck, modifyEnterpriseCheck, getEnterpriseCheckDetail, getCheckType, getCheckInfoList, getEnterpriseList, delphoto} from "@/api/enterpriseCheck";
import Uploader from "@/components/uploader.vue";
import {host, baseUrl} from "@/utils/config";
import Signature from "@/components/signature.vue";
import {onLoad} from "@dcloudio/uni-app";

const userInfo = uni.getStorageSync('userInfo')
const dict = reactive({})
const formData = ref(null)
const pageData = reactive({
  activeCollapse: 1,
  formData: {
    parentName: '',
    parentId: null,
    comNum: 1,
    recorddtlList: []
  },
  dangerList: []
})
const formRule = {
  parentName: [
    {
      required: true,
      message: '请选择部门'
    }
  ],
  okSign1: [
    {
      required: true,
      message: '请签字'
    }
  ],
  okSign2: [
    {
      required: true,
      message: '请签字'
    }
  ],
  okSign3: [
    {
      required: true,
      message: '请签字'
    }
  ],
  todoSign1: [
    {
      required: true,
      message: '请签字'
    }
  ],
  todoSign2: [
    {
      required: true,
      message: '请签字'
    }
  ],
  todoSign3: [
    {
      required: true,
      message: '请签字'
    }
  ],
  nookSign1: [
    {
      required: true,
      message: '请签字'
    }
  ],
  nookSign2: [
    {
      required: true,
      message: '请签字'
    }
  ],
  nookSign3: [
    {
      required: true,
      message: '请签字'
    }
  ]
}
const placeholder = reactive({
  csnamePh: '请先选择所属管辖',
  checkinfoId: '请先选择检查类型'
})
const remoteParams = reactive({
  xq: {
    api: getDeptByParent,
    params: {
      parentid: userInfo.dept.deptId,
      deptType: '0'
    },
    field: {
      text: 'deptName',
      value: 'deptId'
    }
  },
  checkType: {
    api: getCheckType,
    params: {
      deptId: userInfo.dept.deptId
    },
    field: {
      text: 'typename',
      value: 'id'
    }
  },
  checkInfo: {
    api: getCheckInfoList,
    params: {
      typeid: ''
    },
    field: {
      text: 'content',
      value: 'id'
    }
  },
  com: {
    api: getEnterpriseList,
    params: {
      deptId: userInfo.dept.deptId,
      name: ''
    }
  }
})

watch(
    () => pageData.formData.deptId,
    (nv, ov) => {
      console.log('change xqid', nv, ov)
      remoteParams.com.params.deptId = nv
      if (!pageData.dangerList.length) return
      nv ? placeholder.csnamePh = '请选择场所' : placeholder.csnamePh = '请先选择所属管辖'
      getDangerList().then(res => {
        pageData.dangerList = res.rows.map(item => {
          return {
            text: item.name,
            value: item.id
          }
        })
      })
    },
    {
      deep: true
    }
)
watch(
    () => pageData.formData.checktypeId,
    (nv, ov) => {
      console.log('change xqid', nv, ov, pageData.dangerList)
      if (pageData.dangerList.length) return
      getDangerList().then(res => {
        pageData.dangerList = res.rows.map(item => {
          return {
            text: item.name,
            value: item.id
          }
        })
      })
    },
    {
      deep: true
    }
)

watch(
    () => pageData.formData.checktypeId,
    (nv, ov) => {
      console.log(nv, ov)
      console.log('pageData.formData', pageData.formData)
      if (pageData.formData.id || nv === ov) return
      remoteParams.checkInfo.params.typeid = nv
      nv ? placeholder.checkinfoId = '请选择检查内容' : placeholder.checkinfoId = '请先选择检查类型'
      getCheckInfoList(remoteParams.checkInfo.params).then(res => {
        pageData.checkInfoList = res.data.map(item => {
          return {
            value: item.id,
            text: item.content
          }
        })
        pageData.formData.recorddtlList = res.data.map(item => {
          return {
            checkinfoId: item.id,
            companyContent: item.content,
            dangerInfo: '',
            deptType: '',
            isOk: 1,
            status: 0,
            checkPhotos: [],
            rectifyPhotos: [],
            zgjy: item.zgjy,
            typeId: item.dangerId || '',
            typeName: item.dangerName || '',
            egPic: item.egPic
          }
        })
      })
    },
    {
      deep: true
    }
)
watch(
    () => pageData.formData.companyName,
    (nv, ov) => {
      console.log(nv, ov)
      remoteParams.com.params.name = nv
    },
    {
      deep: true
    }
)
watch(
    () => pageData.formData.recorddtlList,
    (nv, ov) => {
      console.log('nvov', nv, ov)
      if (isSubmit.value) return
      if (nv.some(item => item.recordId && [0, 3].includes(item.status) && item.isOk === 0)) {
        console.log('status', 2, pageData.formData)
        getFormStatus.value = 2
        pageData.formData.status = 2
        return
      }
      if (nv.some(item => !item.recordId && item.isOk === 0)) {
        console.log('status', 0)
        getFormStatus.value = 0
        pageData.formData.status = 0
        return
      }
      getFormStatus.value = 1
      pageData.formData.status = 1
      console.log('status', 1, pageData.formData.status, pageData.formData)
    },
    {
      deep: true
    }
)

const getFormStatus = ref(1)

const loadingBtn = ref(false)

const isSubmit = ref(false)

const submit = () => {
  console.log('pageData.formData', pageData.formData)
  formData.value.validate().then(({ valid, errors }) => {
    if (valid) {
      isSubmit.value = true
      console.log('success', formData)
      console.log('pagedata', pageData.formData)
      for (let i = 0; i < pageData.formData.recorddtlList.length; i++) {
        pageData.formData.recorddtlList[i].photoList = []
        pageData.formData.recorddtlList[i].photoList = [
          ...pageData.formData.recorddtlList[i].checkPhotos,
          ...pageData.formData.recorddtlList[i].rectifyPhotos
        ]
      }
      console.log('pagedata', pageData.formData)
      loadingBtn.value = true
      let api
      let msg = ''
      if (pageData.formData.id) {
        api = modifyEnterpriseCheck
        msg = '更新成功！'
      } else {
        api = addEnterpriseCheck
        msg = '新增成功！'
      }
      api(pageData.formData).then(res => {
        console.log('create', res)
        if((!userInfo.signUrl && pageData.formData.okSign1) || (userInfo.signUrl && userInfo.signUrl !== pageData.formData.okSign1)) {
          const params = {
            userId: userInfo.userId,
            signUrl: pageData.formData.okSign1
          }
          updateUserSign(params)
        }
        uni.showToast({
          title: msg
        })
        isSubmit.value = false
        uni.navigateBack()
      }).catch(err => {
        loadingBtn.value = false
      })
    }
    else {
      console.log('error submit!!', errors)
      isSubmit.value = false
      uni.showToast({
        title: errors[0].message,
        icon: 'error'
      })
    }
  })
}
const getLocation = () => {
  uni.getLocation({
    type: 'gcj02',
    success: function (res) {
      console.log('当前位置的经度：' + res.longitude)
      console.log('当前位置的纬度：' + res.latitude)
      pageData.formData.lon = res.longitude
      pageData.formData.lat = res.latitude
    },
    fail: function (err) {
      console.log('errrrrr', err)
    }
  })
}
const changeStore = (store) => {
  console.log('iiiiiiii', store)
  pageData.formData.address = store.address
  pageData.formData.fzr = store.fzr
  pageData.formData.fzrPhone = store.fzrPhone
  pageData.formData.safeMember = store.safeMember
  pageData.formData.safePhone = store.safePhone
  pageData.formData.comNum = store.comNum || 1
  pageData.formData.companyId = store.id
  pageData.formData.companyName = store.name
  pageData.formData.imptArea = store.imptArea
  pageData.formData.lon = store.lon
  pageData.formData.lat = store.lat
  if(store.checktypeId) {
    let checkTypeData = []
    remoteParams.checkType.api(remoteParams.checkType.params).then(res => {
      checkTypeData = res[remoteParams.checkType.resField || 'data'].map(item => {
        return {
          text: item[remoteParams.checkType.field.text],
          value: item[remoteParams.checkType.field.value]
        }
      })
      pageData.formData.checktypeId = store.checktypeId
      const index = checkTypeData.findIndex(item => item.value === store.checktypeId)
      pageData.formData.typename = checkTypeData[index].text
    })
  }
  console.log('lonlat', pageData.formData.lon, pageData.formData.lat)
  if (!pageData.formData.lon || !pageData.formData.lat) {
    getLocation()
  }
}

const addCheckItem = () => {
  pageData.formData.recorddtlList = [
    ...pageData.formData.recorddtlList,
    ...[
      {
        typeId: '',
        dangerInfo: '',
        deptType: '',
        checkPhotos: [],
        content: '',
        rectifyPhotos: [],
        status: 0,
        isOk: 0
      }
    ]
  ]
}
const minusCheckItem = (index) => {
  pageData.formData.recorddtlList.splice(index, 1)
}
const confirmSign = (data, type) => {
  console.log('data', data)
  if (data === '') {
    return false
  }
  uni.uploadFile({
    url: uploadUrl, //上传图片的后端接口
    filePath: data,
    name: 'file',
    success: res => {
      console.log('rrrrrrrrr', res)
      pageData.formData[type] = JSON.parse(res.data).fileName
    }
  })
  // pageData.formData[type] = data
}

const clearSign = (type) => {
  pageData.formData[type] = ''
}

Object.assign(dict, uni.getStorageSync('dict'))


const detailId = ref('')
const loading = ref(false)
onLoad((options) => {
  if(options.id) {
    detailId.value = options.id
    getDetail(detailId.value)
    return
  }
  if(options.isContinue) {
    uni.getStorage({
      key: 'createEnterpriseCatch',
      success: (res) => {
        console.log('createEnterpriseCatch', res.data)
        pageData.formData = res.data
      }
    })
  }
  getDangerList().then(res => {
    pageData.dangerList = res.rows.map(item => {
      return {
        text: item.name,
        value: item.id
      }
    })
  })
  pageData.formData.parentName = userInfo.dept.deptName
  pageData.formData.parentId = userInfo.dept.deptId
  pageData.formData.creater = userInfo.userId
  pageData.formData.okSign1 = userInfo.signUrl
  pageData.formData.todoSign1 = userInfo.signUrl
  pageData.formData.nookSign1 = userInfo.signUrl
  if(options.name && options.deptId && options.deptName) {
    pageData.formData.deptId = options.deptId
    pageData.formData.deptName = options.deptName
    pageData.formData.companyName = options.name
  }
})

const getDetail = async(id) => {
  loading.value = true
  await getDangerList().then(res => {
    pageData.dangerList = res.rows.map(item => {
      return {
        text: item.name,
        value: item.id
      }
    })
    getEnterpriseCheckDetail(id).then(res => {
      if ([0,3].includes(res.data.status)) {
        res.data.okSign2 = res.data.todoSign2
        res.data.okSign3 = res.data.todoSign3
        res.data.nookSign2 = res.data.todoSign2
        res.data.nookSign3 = res.data.todoSign3
      }
      pageData.formData = res.data

      if (!pageData.formData.okSign1) {
        pageData.formData.okSign1 = userInfo.signUrl
      }
      if (!pageData.formData.todoSign1) {
        pageData.formData.todoSign1 = userInfo.signUrl
      }
      if (!pageData.formData.nookSign1) {
        pageData.formData.nookSign1 = userInfo.signUrl
      }
      console.log('res.data', res.data)
      console.log('formData', pageData.formData)
      for (let i = 0; i < pageData.formData.recorddtlList.length; i++) {
        pageData.formData.recorddtlList[i].checkPhotos = []
        pageData.formData.recorddtlList[i].rectifyPhotos = []
        for (let j = 0; j < pageData.formData.recorddtlList[i].photoList.length; j++) {
          const photoItem = pageData.formData.recorddtlList[i].photoList[j]
          if (!photoItem.imgUrl) continue
          const tmpArr = photoItem.imgUrl.split('/')
          photoItem.name = tmpArr[tmpArr.length - 1]
          const tmpArr1 = photoItem.name.split('.')
          photoItem.extname = tmpArr1[tmpArr1.length - 1]
          photoItem.url = host + photoItem.imgUrl
          if (photoItem.type === 3) {
            pageData.formData.recorddtlList[i].checkPhotos.push(photoItem)
          }
          if (photoItem.type === 4) {
            pageData.formData.recorddtlList[i].rectifyPhotos.push(photoItem)
          }
        }
      }
      console.log('formData1', pageData.formData)
    })
  })

}

const fullscreenSign = ref(null)
const instance = getCurrentInstance()
const isFullScreen = ref(false)
const currentSign = ref('')
const closeFullScreen = () => {
  isFullScreen.value = false
}
const setFullScreen = (v, field) => {
  isFullScreen.value = true
  currentSign.value = field
}

const signWidth = ref(null)
const signHeight = ref(null)
const confirmSignFs = (canvas, data, type) => {
  console.log('data', canvas, data)
  console.log('canvas', canvas.canvasId)
  uni.getImageInfo({
    src: data,
    success: function(res) {
      signWidth.value = res.width
      signHeight.value = res.height
      console.log('wh', signWidth.value, signHeight.value)
      const ctx = uni.createCanvasContext('fullscreenCanvas')
      console.log('ctx', ctx)
      ctx.translate(0, signWidth.value)
      ctx.rotate((270 * Math.PI) / 180)
      ctx.drawImage(data, 0, 0, signWidth.value, signHeight.value)
      // ctx.drawImage(data, 0, 0, width, height)
      ctx.draw()
      setTimeout(() => {
        uni.canvasToTempFilePath({
          canvasId: 'fullscreenCanvas',
          success: function(res) {
            // 在H5平台下，tempFilePath 为 base64
            console.log('resssssssss', res.tempFilePath)
            uni.uploadFile({
              url: uploadUrl, //上传图片的后端接口
              filePath: res.tempFilePath,
              name: 'file',
              success: res => {
                console.log('rrrrrrrrr', res)
                pageData.formData[type] = JSON.parse(res.data).fileName
                isFullScreen.value = false
              }
            })
            pageData.formData[type] = data
          },
          fail: function (err) {
            console.log('errrrrrrr', err)
          }
        })
      }, 200)
    },
    fail: function(res) {
      console.log('errr', res)
    }
  })
}

const uploadDel = (e) => {
  console.log('eeeeee', e)
  if (!e.id) return
  const params = {
    id: e.id
  }
  delphoto(params)
}

const save = () => {
  uni.setStorage({
    key: 'createEnterpriseCatch',
    data: pageData.formData,
    success: () => {
      uni.showToast({
        title: '暂存成功！',
        icon: 'success'
      })
    }
  })
}

const showEg = ref(false)
const egInfo = ref({})
const handlePopupEg = (item) => {
  console.log('item', item)
  egInfo.value = item
  showEg.value = true
}
</script>

<template>
  <nut-form :model-value="pageData.formData" ref="formData" :rules="formRule">
    <nut-collapse v-model="pageData.activeCollapse" :accordion="true">
      <nut-collapse-item title="基础信息" :name="1">
        <nut-form-item label="主管部门" prop="parentName" label-width="70">
          <nut-input v-model="pageData.formData.parentName" disabled />
        </nut-form-item>
        <nut-form-item label="所属管辖" prop="deptId" label-width="70">
          <select-popup v-model="pageData.formData.deptId" :echo="pageData.formData.deptName" is-remote :remote-params="remoteParams.xq"></select-popup>
        </nut-form-item>
        <nut-form-item label="企业名称" propf="companyName" label-width="70">
          <select-store v-model="pageData.formData.companyName" :placeholder="placeholder.csnamePh" :disabled="!pageData.formData.deptId" :remote-params="remoteParams.com" type="com" @change="changeStore"></select-store>
        </nut-form-item>
        <nut-form-item label="地址" prop="address" label-width="70">
          <nut-input v-model="pageData.formData.address" placeholder="请输入文本" />
        </nut-form-item>
        <nut-form-item label="负责人" prop="fzr" label-width="70">
          <nut-input v-model="pageData.formData.fzr" placeholder="请输入文本" />
        </nut-form-item>
        <nut-form-item label="联系方式" prop="fzrPhone" label-width="70">
          <nut-input v-model="pageData.formData.fzrPhone" placeholder="请输入文本" />
        </nut-form-item>
        <nut-form-item label="安全人员" prop="safeMember" label-width="70">
          <nut-input v-model="pageData.formData.safeMember" placeholder="请输入文本" />
        </nut-form-item>
        <nut-form-item label="联系方式" prop="safePhone" label-width="70">
          <nut-input v-model="pageData.formData.safePhone" placeholder="请输入文本" />
        </nut-form-item>
        <nut-form-item label="企业人数" prop="comNum" label-width="70">
          <nut-input-number v-model="pageData.formData.comNum" input-width="100" min="1" />
        </nut-form-item>
        <nut-form-item label="重点区域" prop="imptArea" label-width="70">
          <nut-input v-model="pageData.formData.imptArea" placeholder="请输入文本" />
        </nut-form-item>
        <!--        <nut-form-item label="检查日期" prop="date" label-width="70">-->
        <!--          <date-popup v-model="pageData.formData.date"></date-popup>-->
        <!--        </nut-form-item>-->
      </nut-collapse-item>
      <nut-collapse-item v-if="userInfo.roleIds.includes(107)" title="检查内容" :name="2">
        <nut-row v-if="!pageData.formData.recorddtlList.length" >
          <nut-col :span="21">　</nut-col>
          <nut-col :span="3">
            <view style="margin: 10px 0 0;">
              <nut-button type="success" size="mini" @click="addCheckItem">
                <template #icon>
                  <nut-icon name="plus" size="20" />
                </template>
              </nut-button>
            </view>
          </nut-col>
        </nut-row>
        <nut-row v-for="(item, index) in pageData.formData.recorddtlList" :key="index">
          <nut-col :span="21">
            <nut-form-item label="隐患类别" :prop="'recorddtlList.' + index + '.typeId'" label-width="70" :rules="[
                {
                  required: true,
                  message: '请选择隐患类别'
                }
            ]">
              <select-popup v-model="item.typeId" :columns="pageData.dangerList" :placeholder="item.typeName" :echo="item.typeName"></select-popup>
            </nut-form-item>
            <nut-form-item label="隐患描述" :prop="'recorddtlList.' + index + '.dangerInfo'" label-width="70" :rules="[
                {
                  required: true,
                  message: '请输入隐患描述'
                }
            ]">
              <nut-input v-model="item.dangerInfo" placeholder="请输入隐患描述" />
            </nut-form-item>
<!--            <nut-form-item label="所属部门" :prop="'recorddtlList.' + index + '.deptType'" label-width="70" :rules="[-->
<!--                {-->
<!--                  required: true,-->
<!--                  message: '请输入所属部门'-->
<!--                }-->
<!--            ]">-->
<!--              <nut-input v-model="item.deptType" placeholder="请输入所属部门" />-->
<!--            </nut-form-item>-->
            <nut-form-item label="隐患照片" :prop="'recorddtlList.' + index + '.checkPhotos'" label-width="70">
              <template #label>
                <view>隐患照片</view>
                <view v-if="item.egPic" class="eg" @click="handlePopupEg(item)"><nut-icon name="tips" custom-color="#fa2c19"></nut-icon></view>
              </template>
              <uploader v-model="item.checkPhotos" :url="uploadUrl" type="3" @uploadDel="uploadDel"></uploader>
            </nut-form-item>
            <nut-form-item label="整改建议" :prop="'recorddtlList.' + index + '.content'" label-width="70" :rules="[
                {
                  required: true,
                  message: '请输入整改建议'
                }
            ]">
              <nut-input v-model="item.content" placeholder="请输入整改建议" />
            </nut-form-item>
            <nut-form-item v-if="item.recordId" label="整改照片" :prop="'recorddtlList.' + index + '.rectifyPhotos'" label-width="70">
              <uploader v-model="item.rectifyPhotos" :url="uploadUrl" type="4" @uploadDel="uploadDel"></uploader>
            </nut-form-item>
            <nut-form-item v-if="item.recordId" label="是否合格" prop="status" label-width="70">
              <nut-switch v-model="item.status" :active-value="1" :inactive-value="0" />
            </nut-form-item>
          </nut-col>
          <nut-col :span="3">
            <view v-if="index === pageData.formData.recorddtlList.length - 1" style="margin: 10px 0 0;">
              <nut-button type="success" size="mini" @click="addCheckItem">
                <template #icon>
                  <nut-icon name="plus" size="20" />
                </template>
              </nut-button>
            </view>
            <view v-if="pageData.formData.recorddtlList.length > 0" style="margin: 10px 0 0;">
              <nut-button type="danger" size="mini" @click="minusCheckItem(index)">
                <template #icon>
                  <nut-icon name="minus" size="20" />
                </template>
              </nut-button>
            </view>
          </nut-col>
          <nut-col :span="24">
            <view style="height: 1px;background: #eee;"></view>
          </nut-col>
        </nut-row>
      </nut-collapse-item>
      <nut-collapse-item v-if="userInfo.roleIds.includes(103) || userInfo.roleIds.includes(115)" title="检查内容" :name="2">
        <nut-form-item label="检查类型" prop="checktypeId" label-width="70" :rules="[
                {
                  required: true,
                  message: '请选择检查类型'
                }
            ]">
<!--          <select-popup v-model="pageData.formData.checktypeId" :disabled="pageData.formData.id" :echo="pageData.formData.typename" is-remote :remote-params="remoteParams.checkType"></select-popup>-->
          <select-popup v-model="pageData.formData.checktypeId" :echo="pageData.formData.typename" is-remote :remote-params="remoteParams.checkType"></select-popup>
        </nut-form-item>
        <nut-row v-for="(item, index) in pageData.formData.recorddtlList" :key="index">
          <nut-col :span="24">
            <nut-form-item label="检查内容" :prop="'recorddtlList.' + index + '.companyContent'" label-width="70" :rules="[
                {
                  required: true,
                  message: '请输入检查内容'
                }
            ]">
              <nut-input v-model="item.companyContent" placeholder="请输入检查内容" />
            </nut-form-item>
            <nut-form-item label="是否合格" prop="isOk">
              <nut-switch v-model="item.isOk" :disable="pageData.formData.id" :active-value="1" :inactive-value="0"/>
            </nut-form-item>
            <nut-form-item v-if="!item.isOk" label="隐患类别" :prop="'recorddtlList.' + index + '.typeId'" label-width="70" :rules="[
                {
                  required: true,
                  message: '请选择隐患类别'
                }
            ]">
              <select-popup v-model="item.typeId" :columns="pageData.dangerList" :placeholder="item.typeName" :echo="item.typeName"></select-popup>
            </nut-form-item>
            <nut-form-item v-if="!item.isOk" label="隐患描述" :prop="'recorddtlList.' + index + '.dangerInfo'" label-width="70" :rules="[
                {
                  required: true,
                  message: '请输入隐患描述'
                }
            ]">
              <nut-input v-model="item.dangerInfo" placeholder="请输入隐患描述" />
            </nut-form-item>
<!--            <nut-form-item v-if="!item.isOk" label="所属部门" :prop="'recorddtlList.' + index + '.deptType'" label-width="70" :rules="[-->
<!--                {-->
<!--                  required: true,-->
<!--                  message: '请输入所属部门'-->
<!--                }-->
<!--            ]">-->
<!--              <nut-input v-model="item.deptType" placeholder="请输入所属部门" />-->
<!--            </nut-form-item>-->
            <nut-form-item v-if="!item.isOk" :prop="'recorddtlList.' + index + '.checkPhotos'" label-width="70">
              <template #label>
                <view>隐患照片</view>
                <view v-if="item.egPic" class="eg" @click="handlePopupEg(item)"><nut-icon name="tips" custom-color="#fa2c19"></nut-icon></view>
              </template>
              <uploader v-model="item.checkPhotos" :url="uploadUrl" type="3" @uploadDel="uploadDel"></uploader>
            </nut-form-item>
            <nut-form-item v-if="!item.isOk" label="整改建议" :prop="'recorddtlList.' + index + '.zgjy'" label-width="70" :rules="[
                {
                  required: true,
                  message: '请输入整改建议'
                }
            ]">
              <nut-input v-model="item.zgjy" placeholder="请输入整改建议" />
            </nut-form-item>
            <nut-form-item v-if="item.isOk === 0 && item.recordId" label="整改照片" :prop="'recorddtlList.' + index + '.rectifyPhotos'" label-width="70">
              <uploader v-model="item.rectifyPhotos" :url="uploadUrl" type="4" @uploadDel="uploadDel"></uploader>
            </nut-form-item>
            <nut-form-item v-if="item.isOk === 0 && item.recordId" label="是否合格" prop="status" label-width="70">
              <nut-switch v-model="item.status" :active-value="1" :inactive-value="0" />
            </nut-form-item>
          </nut-col>
          <nut-col :span="24">
            <view style="height: 1px;background: #eee;"></view>
          </nut-col>
        </nut-row>
      </nut-collapse-item>
      <nut-collapse-item v-if="getFormStatus === 1 && !userInfo.roleIds.includes(106)" title="合格签字" :name="3">
        <nut-form-item label="检查人员签字(合格)" prop="okSign1" label-width="70">
          <view v-if="pageData.formData.okSign1">
            <image :src="host + pageData.formData.okSign1" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('okSign1')">重签</nut-button>
          </view>
          <signature v-else :field="'okSign1'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'okSign1')"></signature>
        </nut-form-item>
        <nut-form-item label="场所人员签字(合格)" prop="okSign2" label-width="70">
          <view v-if="pageData.formData.okSign2">
            <image :src="host + pageData.formData.okSign2" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('okSign2')">重签</nut-button>
          </view>
          <signature v-else :field="'okSign2'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'okSign2')"></signature>
        </nut-form-item>
        <nut-form-item label="主管部门签字(合格)" prop="okSign3" label-width="70">
          <view v-if="pageData.formData.okSign3">
            <image :src="host + pageData.formData.okSign3" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('okSign3')">重签</nut-button>
          </view>
          <signature v-else :field="'okSign3'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'okSign3')"></signature>
        </nut-form-item>
      </nut-collapse-item>
      <nut-collapse-item v-if="getFormStatus === 0 && !userInfo.roleIds.includes(106)" title="整改签字" :name="3">
        <nut-form-item label="检查人员签字(整改)" prop="todoSign1" label-width="70">
          <view v-if="pageData.formData.todoSign1">
            <image :src="host + pageData.formData.todoSign1" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('todoSign1')">重签</nut-button>
          </view>
          <signature v-else :field="'todoSign1'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'todoSign1')"></signature>
        </nut-form-item>
        <nut-form-item label="场所人员签字(整改)" prop="todoSign2" label-width="70">
          <view v-if="pageData.formData.todoSign2">
            <image :src="host + pageData.formData.todoSign2" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('todoSign2')">重签</nut-button>
          </view>
          <signature v-else :field="'todoSign2'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'todoSign2')"></signature>
        </nut-form-item>
        <nut-form-item label="主管部门签字(整改)" prop="todoSign3" label-width="70">
          <view v-if="pageData.formData.todoSign3">
            <image :src="host + pageData.formData.todoSign3" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('todoSign3')">重签</nut-button>
          </view>
          <signature v-else :field="'todoSign3'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'todoSign3')"></signature>
        </nut-form-item>
      </nut-collapse-item>
      <nut-collapse-item v-if="getFormStatus === 2 && !userInfo.roleIds.includes(106)" title="不合格签字" :name="3">
        <nut-form-item label="检查人员签字(不合格)" prop="nookSign1" label-width="70">
          <view v-if="pageData.formData.nookSign1">
            <image :src="host + pageData.formData.nookSign1" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('nookSign1')">重签</nut-button>
          </view>
          <signature v-else :field="'nookSign1'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'nookSign1')"></signature>
        </nut-form-item>
        <nut-form-item label="场所人员签字(不合格)" prop="nookSign2" label-width="70">
          <view v-if="pageData.formData.nookSign2">
            <image :src="host + pageData.formData.nookSign2" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('nookSign2')">重签</nut-button>
          </view>
          <signature v-else :field="'nookSign2'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'nookSign2')"></signature>
        </nut-form-item>
        <nut-form-item label="主管部门签字(不合格)" prop="nookSign3" label-width="70">
          <view v-if="pageData.formData.nookSign3">
            <image :src="host + pageData.formData.nookSign3" style="width: 260px;height: 150px;" />
            <nut-button size="mini" type="primary" @click="clearSign('nookSign3')">重签</nut-button>
          </view>
          <signature v-else :field="'nookSign3'" @confirm="confirmSign" @clear="clearSign" @set-full-screen="(v) => setFullScreen(v, 'nookSign3')"></signature>
        </nut-form-item>
      </nut-collapse-item>
    </nut-collapse>
  </nut-form>
  <nut-cell v-if="!userInfo.roleIds.includes(106)">
    <nut-row :gutter="20">
      <nut-col :span="12">
        <nut-button :loading="loadingBtn" type="primary" block @click="submit">提交</nut-button>
      </nut-col>
      <nut-col :span="12">
        <nut-button :loading="loadingBtn" type="success" block @click="save">暂存</nut-button>
      </nut-col>
    </nut-row>
  </nut-cell>
  <view v-if="isFullScreen" class="fullscreen-sign">
    <view class="sign">
      <nut-signature
          ref="fullscreenSign"
          custom-class="fullscreenSign"
          @confirm="(canvas, data) => confirmSignFs(canvas, data, currentSign)"
          @clear="clearSign(currentSign)"
      />
      <canvas v-if="signWidth && signHeight" canvas-id="fullscreenCanvas" :style="`width:${signHeight}px; height:${signWidth}px;position: absolute;left: -9999px;`"></canvas>
    </view>
    <view class="btn">
      <nut-button type="primary" @click="closeFullScreen">关闭全屏</nut-button>
    </view>
  </view>
  <nut-popup position="bottom" v-model:visible="showEg">
    <view class="head-popup">图片示例</view>
    <view class="body-popup">
      <nut-form>
        <nut-form-item label="检查内容">
          {{ egInfo.companyContent }}
        </nut-form-item>
        <nut-form-item label="示例图片">
          <image style="width: 200px; height: 200px;" :src="host + egInfo.egPic"></image>
        </nut-form-item>
      </nut-form>
    </view>
  </nut-popup>
  <nut-safe-area position="bottom" />
</template>

<style scoped lang="scss">
.eg{padding: 10px 0 0;text-align: center}
.head-popup{padding: 20px 0 10px;text-align: center;font-size: 20px}
</style>
